<%@page contentType="text/html; charset=UTF-8" language="java"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html lang="cn">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>模板</title>
<!-- begin header 头部 -->
<%@include file="include/header.jsp"%>
<link rel="stylesheet" href="${contextPath }/css/style.css">
<!-- end header -->
</head>
<body>
	<c:set var="product_list_current" value="active" />
	<!-- begin 导航条 -->
	<%@include file="include/nav.jsp"%>
	<!-- end 导航条 -->
	<div class="row">
		<!-- begin菜单 -->
		<%@include file="include/menu.jsp"%>
		<!-- end菜单 -->
		<div class="span9">
			<div class="row">
				<table class="table table-striped">
					<thead>
						<th>产品id</th>
						<th>产品图片</th>
						<th>产品名称</th>
						<th>创建时间</th>
						<th>最近更新时间</th>
						<th>产品描述</th>
						<th>操作</th>
					</thead>
					<tbody id="contents">
						<c:forEach items="${products }" var="product">
							<tr>
								<td class="span1">${product.id }</td>
								<td><img alt="" src="${product.images }&width=80&height=80"></td>
								<td class="span2"><a href="${contextPath }/product_detail.do?id=${product.id}">${product.name }</a>
								<td class="span2">${product.gmtCreate }</td>
								<td class="span2">${product.gmtModified }</td>
								<td>${product.description }</td>
								<td class="span2"><a href="${contextPath }/innov/product_edit.do?id=${product.id}">修改/</a><a href="${contextPath }/innov/product_delete.do?id=${product.id}">删除/</a><a target="_blank" href="${contextPath }/product_detail.do?id=${product.id}">浏览</a></td>
							</tr>
						</c:forEach>
					</tbody>
				</table>
			</div>
			<div class="row" id="paginate">
			
			</div>
		</div>
	</div>
	<!-- begin foot 依赖-->
	<%@include file="include/foot.jsp"%>
	<script type="text/javascript" src="${contextPath }/js/jquery.paginate.js"></script>
	<script type="text/javascript">
		$(function(){
			$('#paginate').paginate({
				count: ${totalPage},
				start: ${pageNo},
				display: 12,
				border: false,
				text_color  			: '#79B5E3',
				background_color    	: 'none',	
				text_hover_color  		: '#2573AF',
				background_hover_color	: 'none', 
				images		: false,
				mouse		: 'press',
				onChange: function(page){
					$.ajax({
						type: 'POST',
						url: contextPath + '/innov/product_list_json.do',
						dataType: 'json',
						data: 'pageNo=' + page + "&pageSize=5",
						success: function(msg){
							if(msg.r == 0) {
								$('#contents').empty();
							}
							$.each(msg.info, function(i,v){
								var tr = $("<tr></tr>");
								tr.append("<td class='span1'>" + v.id + "</td>");
								tr.append("<td><img alt='' src='" + v.images + "&width=80&height=80'></td>")
								tr.append("<td class='span2'><a href='" + contextPath + "/product_detail.do?id=" + v.id + "'>" + v.name +"</a>")
								tr.append('<td class="span2">' + v.gmtCreate +'</td>');
								tr.append('<td class="span2">' + v.gmtModified +'</td>');
								tr.append('<td>' + v.description + "</td");
								tr.append('<td class="span2"><a href="' + contextPath + '/innov/product_edit.do?id=' + v.id + '">修改/</a><a href="' + contextPath + '/innov/product_delete.do?id='+v.id+'">删除/</a><a target="_blank" href="' + contextPath + '/product_detail.do?id=' + v.id + '">浏览</a></td>')
								$('#contents').append(tr);
							});
						}
					});
				}
			});
		});
	</script>
	<!-- end foot 依赖 -->
</body>
</html>